$(function () {
    var seriesSwiper = new Swiper('.series .swiper-container', {
        prevButton: '.swiper-button-prev',
        nextButton: '.swiper-button-next',
        slidesPerView: 'auto', //'auto'
        slidesOffsetAfter: 140,
        onlyExternal: true,
        onSlideChangeEnd: function (swiper) {
            console.log(swiper.activeIndex) //切换结束时，告诉我现在是第几个slide
            if (swiper.activeIndex == 0) {
                $('.series .arr-left').addClass('disable')
                $('.series .arr-right').removeClass('disable')
            } else if (swiper.activeIndex == 11) {
                $('.series .arr-right').addClass('disable')
                $('.series .arr-left').removeClass('disable')
            } else {
                $('.series .arr-left').removeClass('disable')
                $('.series .arr-right').removeClass('disable')
            }
        }
    })
    $('.series .arr-left').click(function () {
        console.log(seriesSwiper);
        seriesSwiper.slideTo(seriesSwiper.activeIndex - 7)
        console.log(seriesSwiper);
    })
    $('.series .arr-right').click(function () {
        seriesSwiper.slideTo(seriesSwiper.activeIndex + 7)
    })
    $('.series .trigger').click(function () {
        $('.series .products-wrapper').toggleClass('active')
    })
})

$(function () {
    var proImgsSwiper = new Swiper('.proImgs-con', {
        slidesPerView: 'auto', //'auto'
        onlyExternal: true,
        slidesOffsetAfter: 10,
    })
    $('.proImgs .item').click(function() {
        let index = $(this).index();
        let activeIndex = $('.proImgs .img-list .active').index()
        if (index != 0) {
            $('.proDetail .skin').hide()
        } else {
            $('.proDetail .skin').show()
        }
        $('.proImgs .img-list .item').eq(index).addClass('active')
        $('#m-pro-img').attr('src', $('.proImgs .img-list .item').eq(index).data('img'))
        $('.proImgs .img-list .item').eq(activeIndex).removeClass('active')
    })
    $('.proImgs .scroll-right').click(function () {
        let activeIndex = $('.proImgs .img-list .active').index()
        if (activeIndex + 1 >= $('.proImgs .img-list .item').length) {
            return;
        }
        if (proImgsSwiper.activeIndex + 4 < activeIndex) {
            proImgsSwiper.slideNext();
        }
        $('.proDetail .skin').hide()
        $('.proImgs .img-list .item').eq(activeIndex + 1).addClass('active')
        $('#m-pro-img').attr('src', $('.proImgs .img-list .item').eq(activeIndex + 1).data('img'))
        $('.proImgs .img-list .item').eq(activeIndex).removeClass('active')

    })
    $('.proImgs .scroll-left').click(function () {
        console.log($('.proImgs .img-list .active').index());
        console.log(proImgsSwiper.activeIndex);
        let activeIndex = $('.proImgs .img-list .active').index()
        if (activeIndex - 1 < 0) {
            return;
        }
        if (activeIndex >= 6) {
            proImgsSwiper.slidePrev();
        }
        $('.proImgs .img-list .item').eq(activeIndex - 1).addClass('active')
        $('#m-pro-img').attr('src', $('.proImgs .img-list .item').eq(activeIndex - 1).data('img'))
        if (activeIndex - 1 == 0) {
            $('.proDetail .skin').show()
        } else {
            $('.proDetail .skin').hide()
        }
        $('.proImgs .img-list .item').eq(activeIndex).removeClass('active')
    })
})

$(function () {
    var rcmSwiper = new Swiper('.rcmSwiper', {
        autoplay: 5000, //可选选项，自动滑动
        slidesPerView: 'auto',
        onlyExternal: true,
    })
    $('.rcmSwiper-wrapper .tleft').click(function () {
        rcmSwiper.slidePrev();
    })
    $('.rcmSwiper-wrapper .tright').click(function () {
        rcmSwiper.slideNext();
    })
})

$(function () {
    $('.page_pc .scaleBox .btnVideo>div.vf').click(function () {
        let oVid = $(`#${this.dataset.vid}`)[0];
        let oVideo = oVid.querySelector('video');
        let oVf = oVid.querySelector('.vf');
        let oClose = oVid.querySelector('.scaleClose');
        if (oVideo.paused) {
            $(oVid).addClass('active')
            $(oVf).hide()
            oVideo.play()
            $(oClose).css('opacity', 1)

            $(oVid).siblings('.btnVideo').find('.scaleClose').click();
        }
    })
    $('.scaleClose').click(function () {
        let oVid = $(`#${this.dataset.vid}`)[0];
        let oVideo = oVid.querySelector('video');
        let oVf = oVid.querySelector('.vf');
        let oClose = oVid.querySelector('.scaleClose');
        $(oVideo)[0].pause()
        $(oVid).removeClass('active')
        $(oVf).show()
        $(oClose).css('opacity', 0)
    })
})

$(function () {
    $('.page_pc .tab01 .btnUl li').click(function () {
        console.log($(this).index());
        $('.page_pc .tab01 .tabUl li').eq($(this).index()).addClass('active').siblings().removeClass('active');
        $(this).addClass('active').siblings().removeClass('active');
    })
    $('.page_pc .tabBox .btnLeft').click(function () {
        clearInterval(timer)
        timer = setInterval(() => {
            $('.page_pc .tab03 .btnRight').click();
        }, 3000)
        let oTabBox = this.closest('.tabBox');
        let oTabUl = oTabBox.querySelector('.tabUl')
        let activeIndex = $(oTabUl).find('.active').index();
        if (activeIndex - 1 < 0) {
            activeIndex = $(oTabUl).find('li').length;
        }
        $(oTabUl).find('li').eq(activeIndex - 1).addClass('active')
            .siblings().removeClass('active');
    })
    $('.page_pc .tabBox .btnRight').click(function () {
        clearInterval(timer)
        timer = setInterval(() => {
            $('.page_pc .tab03 .btnRight').click();
        }, 3000)
        let oTabBox = this.closest('.tabBox');
        let oTabUl = oTabBox.querySelector('.tabUl')
        let activeIndex = $(oTabUl).find('.active').index();
        if (activeIndex + 1 >= $(oTabUl).find('li').length) {
            activeIndex = -1;
        }
        $(oTabUl).find('li').eq(activeIndex + 1).addClass('active')
            .siblings().removeClass('active');
    })

    var timer = setInterval(() => {
        $('.page_pc .tab03 .btnRight').click();
    }, 3000)
})

$(function () {
    $('.vsScrollBox').scroll(function () {
        let ratio = 212 / 698;
        let ratio2 = 293 / 380;
        let disTop = $(this).scrollTop() * ratio;
        let disLeft = $(this).scrollLeft() * ratio2;
        $('.scrollBarRight').css({
            top: disTop + 185,
        })
        $('.scrollBarBottom').css({
            left: disLeft
        })
    })
    $('.scrollBarRight').on('mousedown', function (e) {
        let disX = e.pageX - $(this).offset().left;
        let disY = e.pageY - $(this).offset().top;
        $(document).on('mousemove', (e) => {
            if (!(e.pageY - disY < 15200 || e.pageY - disY > 15412)) {

                $(this).offset({
                    top: e.pageY - disY,
                })
                $('.vsScrollBox').scrollTop((698 / 212) * (parseInt($(this).css('top')) - 180))
            }
            $(document).on('mouseup', function () {
                $(document).off('mousemove mouseup')
            })
        })
    })
    $('.scrollBarBottom').on('mousedown', function (e) {
        let disX = e.pageX - $(this).offset().left;
        let disY = e.pageY - $(this).offset().top;
        $(document).on('mousemove', (e) => {
            if (!(e.pageX - disX < 126 || e.pageX - disX > 419)) {

                $(this).offset({
                    left: e.pageX - disX,
                })
                $('.vsScrollBox').scrollLeft((380 / 293) * (parseInt($(this).css('left'))))
            }
            $(document).on('mouseup', function () {
                $(document).off('mousemove mouseup')
            })
        })
    })

    $('.num_z .add').click(function() {
        $('#product_count').val(+$('#product_count').val() + 1);
    })
    $('.num_z .reduce').click(function() {
        let num = +$('#product_count').val();
        if (num - 1 <= 0) {
            return;
        }
        $('#product_count').val(num-1);
    })

    $('.buybtn').click(function() {
        console.log(sessionStorage.uname);
        if (!sessionStorage.uname) {
            $('.login-link').click();
            return;
        }
        console.log(+$('#product_count').val());
        Goods.insert({uid:sessionStorage.uid, gid:this.dataset.gid, addNum:+$('#product_count').val()})
        $('.__b-popup1__').show();
        $('.addSuccess').show();
    })
    $('.addSuccess .close').click(function() {
        $('.__b-popup1__').hide();
        $('.addSuccess').hide();
        window.loadCart();
    })
    $('.addSuccess .continue').click(function() {
        $('.addSuccess .close').click();
    })
})